﻿<div class="box border orange col-sm-8">
											<div class="box-title">

												<div class="tools hidden-xs">
													<a href="#box-config" data-toggle="modal" class="config">
														<i class="fa fa-cog"></i>
													</a>
													<a href="javascript:;" class="reload">
														<i class="fa fa-refresh"></i>
													</a>
													<a href="javascript:;" class="collapse">
														<i class="fa fa-chevron-up"></i>
													</a>
													<a href="javascript:;" class="remove">
														<i class="fa fa-times"></i>
													</a>
												</div>
											</div>
											<div class="box-body big ">
												<h3 class="form-title">分类添加</h3>
												<form role="form" action="" method="post" enctype="multipart/form-data">
													  <div class="form-group col-sm-2">
														<label for="exampleInputEmail1">分类名称</label>
														<input type="text" class="form-control" id="exampleInputEmail1" name="name" >
													  </div>
													  <div class="form-group">
															<label for="exampleInputPassword1">分类归属</label><br>
															<div class="col-sm-2 list">
																 <select class="form-control slec" name="pid" >
																 	<option value=>顶级分类</option>
																 <?php foreach ($cate as $v){?>
															  		<option value="<?php echo $v['id']?>" ><?php echo $v['name']?></option>
																  <?php }?>
																 </select>
																 <div class="divide-20"></div>
															</div>
													  </div>



													  <div class="col-sm-offset-0 col-sm-10">
														  <button type="submit" class="btn btn-pink" >提交</button>
													  </div>
												</form>

										    </div>


											</div>
								</div>


<script src="resources/admin/js/jquery/jquery-2.0.3.min.js"></script>
<script type="text/javascript">

			$(function(){
				/*绑定值改变事件当值改变时--->*/
				$('.list').on('change','.slec',function(){

					/*获取当前操作标签的id*/
					var id = $(this).val();//alert(id);

					/*设置，当前操作标签之后的select都删除*/
					$(this).nextAll().remove();

					/*获取'select'的选中的值的下标，*/
					var a = $(this).get(0).selectedIndex;

					/*如果选中值的下标为0，停止执行ajax代码*/
					if(a == 0){
						return false;
					}

					/*将获取的id通过get的提交方式拼接在url属性中，在程序处理文件上查询pid=id的数据并返回，返回时输出查询到的数据用追加select标签的方式输出*/
					$.ajax({
						type:'get',
						url:'index.php?c=cate&a=add&admin=1&id='+id,
						dataType:'json',
						success:function(js){

							var list = '';
							if(js!=''){
									list+='<select class="form-control slec " name="pid" >';
									list+='<option value='+id+'>上一级</option>';
									for (i in js){

							  			list+='<option value="'+js[i].id+'">'+js[i].name+'</option>';
							  		}

									list+='</select>';


									$('.list').append(list);
							}
						}
					})

				})
			})

</script>